<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="../js/cookie.js"></script>
</head>
<body>
    <button id="save">保存Cookie</button>
    <button id="get">获取Cookie</button>

    <script>
        // cookie 的注意
        // 1. cookie 不能跨网站 (域名)
        // 2. cookie 不能跨浏览器 
        // 3. cookie 有些浏览器使用中文时候 会出现乱码  
        // 设置 cookie 进行编码  encodeURIComponent        获取cookie 进行解码  decodeURIComponent

        // 4. cookie 内容是纯文本  只能保存字符串数据  
        // 对象和数组也要转成字符串  
        // var list = ["a","b","c"] = 'a,b,c'
        // var obj = {d:1,e:100} = [object Object]
        // JSON.parse    字符串格式的对象转成  JSON对象 
        // JSON.stringify    JSON对象转成 字符串格式的对象  
        
        // 5 cookie 存储读取必须依赖余服务器环境  localhost  


        var save = document.getElementById("save")
        var get = document.getElementById('get')

        save.onclick = function(){
            // setCookie("user","小王",7)
            var list = ["a","b","c"]
            var obj = {d:1,e:100}

            // setCookie('list',list,7)
            // setCookie("obj",obj,7)
            setCookie('list',JSON.stringify(list),7)
            setCookie("obj",JSON.stringify(obj),7)
        }

        get.onclick = function(){
            var list = getCookie("list")
            var obj = getCookie("obj")
            console.log(list)
            console.log(obj)

            console.log(JSON.parse(list))
            console.log(JSON.parse(obj))
        }

    </script>
</body>
</html>